<template>
  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    switchFullscreen
    @ok="handleOk"
    :okButtonProps="{ class: { 'jee-hidden': disableSubmit } }"
    @cancel="handleCancel"
    :maskClosable="false"
    :destroyOnClose="true"
  >
    <a-card>
      <!-- <div class="table-page-search-wrapper">
        <a-form layout="inline" @keyup.enter.native="searchQuery">
          <a-row>
            <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <span style="float: left; overflow: hidden; margin: 2px 4px" class="table-page-search-submitButtons">
                <a-button type="primary" @click="handleExportXls('scoreForm')">导出成绩单</a-button>
              </span>
            </a-col>
          </a-row>
        </a-form>
      </div> -->

      <!-- table区域-begin -->
      <!-- <div>
        <div class="date-totals">
          <p>
            <span>阶段数据：</span>
            <span>最高分：{{ this.maxScore }}</span>
            <span>最低分：{{ this.minScore }}</span>
            <span>平均分：{{ this.avgScore }}</span>
          </p>
        </div>
        <a-table
          ref="table"
          size="middle"
          bordered
          :columns="columns"
          :pagination="false"
          :dataSource="dataSource"
          :loading="loading"
          class="grandForm-table"
          @change="handleTableChange"
        >
        </a-table>
      </div> -->
      <div>
      <div id="myChart" style="height: 400px" class="MpriceImage-table"></div>
    </div>
    </a-card>
  </j-modal>
</template>

<script>
import '@/assets/less/TableExpand.less'
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { httpAction, getAction } from '@/api/manage'
import { filterMultiDictText } from '@/components/dict/JDictSelectUtil'
import { axios } from '@/utils/request'
// 引入基本模板
import * as echarts from 'echarts/lib/echarts'
// // 引入基本模板
// let echarts = require('echarts/lib/echarts')
// 引入柱状图组件
require('echarts/lib/chart/bar')
// 引入提示框和title组件
require('echarts/lib/component/tooltip')
require('echarts/lib/chart/line')
require('echarts/lib/component/toolbox')
require('echarts/lib/component/title')
require('echarts/lib/component/legend')
require('echarts/lib/component/grid')
export default {
  mixins: [JeecgListMixin, mixinDevice],
  data() {
    return {
      visible: false,
      dataSource: [],
      maxScore: '',
      minScore: '',
      avgScore: '',
      courseId: '',
      examTime: '',

      url: {
        list: '/grandForm/getCourseScore',
        export: '/grandForm/export',
      },
      // 表头
      // columns: [
      //   {
      //     title: '成绩单',
      //     align: 'center',
      //     children: [
      //       {
      //         title: '序号',
      //         dataIndex: '',
      //         key: 'rowIndex',
      //         align: 'center',
      //         width: 60,
      //         customRender(text, record, index) {
      //           return parseInt(index) + 1
      //         },
      //       },
      //       {
      //         title: '学号',
      //         align: 'center',
      //         dataIndex: 'workNo',
      //         ellipsis: true,
      //       },
      //       {
      //         title: '姓名',
      //         align: 'center',
      //         dataIndex: 'name',
      //         ellipsis: true,
      //       },
      //       {
      //         title: '成绩',
      //         dataIndex: 'score',
      //         align: 'center',
      //         ellipsis: true,
      //       },
      //     ],
      //   },
      // ],
    }
  },
  created() {},

  computed: {},
  methods: {
    echarts1(xData, yData) {
      var chartDom = document.getElementById('myChart');
      var myChart = echarts.init(chartDom);
      var option;

      option = {
        xAxis: {
          type: 'category',
          data: xData,
        },
        yAxis: {
          type: 'value',
        },
        series: [
          {
            data: yData,
            type: 'line',
            smooth: true,
          },
        ],
      };

      option && myChart.setOption(option);
    },
    getParams(record) {
      this.visible = true
      // 取到路由带过来的参数
      // this.dataSource = dataSource
      console.log('接受的datasource的值：' + record.workNo+','+record.courseId)
      // this.maxScore = maxScore
      // console.log('mmx', maxScore)
      // this.minScore = minScore
      // this.avgScore = avgScore
      // this.courseId = courseId
      // this.examTime = examTime
       getAction(this.url.list, {
        courseId: record.courseId,
        workNo:record.workNo,
      }).then((res) => {
        console.log(res.success)
        if (res.success) {
          let xData = []
          let yData = []

          console.log('测试测试' + res.result.length)
          for (let i = 0; i < res.result.length; i++) {
            xData.push(res.result[i].examTime)
            yData.push(res.result[i].score)
          }
          console.log("dd"+yData)
          this.echarts1(xData, yData)
        }
        if (res.code === 510) {
          this.$message.warning(res.message)
        }
        this.loading = false
      })
    },

    handleExportXls(fileName) {
      if (!fileName || typeof fileName != 'string') {
        fileName = '导出文件'
      }
      let param = { courseId: this.courseId, examTime: this.examTime }
      console.log('导出参数', param)
    //  getAction(this.url.export,{courseId: this.courseId, examTime: this.examTime,
    //     responseType: 'blob'})
      axios({
        url: this.url.export,
        params: param,
        method: 'get',
        responseType: 'blob',
      }).then((data) => {
        if (!data) {
          this.$message.warning('文件下载失败')
          return
        }
        if (typeof window.navigator.msSaveBlob !== 'undefined') {
          window.navigator.msSaveBlob(new Blob([data], { type: 'application/vnd.ms-excel' }), fileName + '.xls')
        } else {
          let url = window.URL.createObjectURL(new Blob([data], { type: 'application/vnd.ms-excel' }))
          let link = document.createElement('a')
          link.style.display = 'none'
          link.href = url
          link.setAttribute('download', fileName + '.xls')
          document.body.appendChild(link)
          link.click()
          document.body.removeChild(link) //下载完成移除元素
          window.URL.revokeObjectURL(url) //释放掉blob对象
        }
      })
    },
    handleOk() {
      this.visible = false
    },
    handleCancel() {
      this.visible = false
    },
  },
}
</script>
<style scoped>
@import '~@assets/less/common.less';
</style>
<style lang="less" scoped>
//合计行样式
.date-totals {
  font-size: 17px;
  font-weight: 600;
  margin: 0 20px;
  margin-bottom: -4px;
  margin-top: 2px;
  span:not(:first-child) {
    margin-right: 20px;
  }
}
//搜索区域缩小
/deep/ .small-search {
  .ant-col .ant-form-item {
    margin-bottom: 6px;
  }
}
</style>



